<template>
    <div class="cv">
      <h1>个人简介</h1>
      <div class="profile">
        <img src="https://picsum.photos/200/200" alt="个人照片">
        <div class="info">
          <h2>张三</h2>
          <p>Web前端开发工程师</p>
          <p>邮箱: **********@example.com</p>
          <p>电话: **********</p>
        </div>
      </div>
      <div class="skills">
        <h3>技能</h3>
        <ul>
          <li>HTML5</li>
          <li>CSS3</li>
          <li>JavaScript</li>
          <li>Vue.js</li>
          <li>Vue</li>
        </ul>
      </div>
      <div class="experience">
        <h3>工作经验</h3>
        <p>2020-至今 某科技公司 前端开发工程师</p>
        <p>2018-2020 某互联网公司 前端开发实习生</p>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    name: 'CV'
  }
  </script>
  
  <style scoped>
  .cv {
    padding: 20px;
    max-width: 800px;
    margin: 0 auto;
    text-align: left;
  }
  
  .profile {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
  }
  
  .profile img {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin-right: 30px;
  }
  
  .info {
    flex: 1;
  }
  
  .skills, .experience {
    margin-bottom: 20px;
  }
  
  ul {
    list-style-type: disc;
    padding-left: 20px;
  }
  </style>  